<template>
  <div class="lynx-main lynx-add">
    <el-form ref="formRef" :model="formAdd" :rules="rules" label-width="100px">
      <BaseFormItems :form="formAdd" :items="formItems" :exclude="exclude" />
    </el-form>
    <div class="tools">
      <div class="tools-left"></div>
      <div class="tools-right">
        <el-button type="primary" size="small" @click="reset">重置</el-button>
        <el-button v-p="buildPer(':add')" type="success" size="small" @click="doSubmit"
          :loading="loading">提交</el-button>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import BaseFormItems from '@/components/base/baseFormItems.vue';

import api from "@/axios/api";
import { ref, reactive } from "vue";
import { ElMessage } from "element-plus";
import { dictRef } from "@/utils/dictUtil";
import { packParams } from "@/utils/formUtil";
import { base, AllFormKeysArrType } from './base';
import { ${dv}, formItems } from './main';
import { useDoSubmit } from '@/components/base/baseHook';
const emit = defineEmits(['success']);
const { baseForm, baseDict, baseRules, baseApi, buildPer } = base;
const formAdd = reactive<${dv}>({
  ...baseForm()
});
const dict = dictRef([]);
const rules = reactive({
  ...baseRules()
});
const { loading, formRef, doSubmit } = useDoSubmit(submit)
const reset = () => { formRef.value.resetFields(); }
const exclude:AllFormKeysArrType = ['createTime', 'updateTime'];
async function submit() {
  const res = await baseApi().insert(packParams(formAdd))
  if (res.isSuccess) {
    reset();
    emit('success', res.data);
    ElMessage.success(res.message);
  } else {
    ElMessage.error(res.message);
  }
}
</script>

<style lang="scss" scoped></style>